<template>
  <div class="user">
    <div class="header">
      <van-nav-bar
        title="个人中心"
        left-text="返回"
        right-text="退出"
        left-arrow
        @click-left="$router.go(-1)"
        @click-right="logoutHandler"
      />
    </div>
    <div class="content">
      <van-cell-group title="个人中心">
        <van-cell title="地址管理" is-link to="/address" />
        <van-cell title="订单中心" is-link to="/order" />
      </van-cell-group>
    </div>
    <HomeFooter />
  </div>
</template>

<script setup lang="ts">
import { useUserStore } from '@/store/userStore'

// 只能在hooks 里面使用
import { useRouter } from 'vue-router'
const router = useRouter()
const user = useUserStore()

// pinia 驱动事件

// 退出
// 1 清空token  useid   tel
// 2 重新跳转到login 页面
const logoutHandler = () => {
  user
    .logout()
    .then((res) => {
      console.log(res)
      // 跳转
      router.replace('/login')
    })
    .catch((err) => {
      console.log(err)
    })
}
</script>

<style scoped lang="scss">
.user {
  .content {
    padding-top: 15px;
  }
}
</style>
